<template>
  <a-modal v-model:open="open">
    <template #title>
      <div class="title">历史记录</div>
    </template>

    <a-table :columns="columns" :dataSource="List" rowKey="id" :loading="loading" />
    <template v-if="hasChat">
      <div id="chart-main" />
    </template>
  </a-modal>
</template>
<script setup lang="ts">
import { list } from 'postcss'
import { ref, reactive, onMounted } from 'vue'
import * as echarts from 'echarts'
let myChart: any = undefined

const open = ref<boolean>(false)
const loading = ref<boolean>(false)
const hasChat = ref<boolean>(false)
const columnsCheck = ref<any[]>([
  {
    title: '体检时间',
    dataIndex: 'createTime',
    key: 'createTime',
    align: 'left'
  },
  {
    title: '项目名称',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '结果',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '提示',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '单位',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '参考范围',
    dataIndex: 'createUser',
    key: 'createUser'
  }
])

const columnsOther = ref<any[]>([
  {
    title: '体检时间',
    dataIndex: 'createTime',
    key: 'createTime',
    align: 'left'
  },
  {
    title: '检查项目名称',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '检查所见',
    dataIndex: 'createUser',
    key: 'createUser'
  },
  {
    title: '检查结论',
    dataIndex: 'createUser',
    key: 'createUser'
  }
])

const columns = ref<any[]>([])

const List = ref<any>([])

const init = (data: any, isChart: boolean, type: string) => {
  if (type === 'check') {
    columns.value = columnsCheck.value
  } else {
    columns.value = columnsOther.value
  }
  hasChat.value = isChart
  List.value = []
  if (myChart) {
    myChart.dispose()
    myChart = null
  }

  if (isChart) {
    initChart()
  }
}

const initChart = () => {
  const chartMain: any = document.getElementById('chart-main')
  myChart = echarts.getInstanceByDom(chartMain)
  if (!myChart) {
    myChart = echarts.init(chartMain)
  }
}

onUnmounted(() => {
  if (myChart) {
    myChart.dispose()
    myChart = null
  }

  hasChat.value = false
  List.value = []
  loading.value = false
})

defineExpose({
  init
})
</script>
<style lang="less" scoped></style>
